<div class="main-header">
    <div class="btn-list">
        <a ng-if="roleid!=6" href="javascript:void(0)" id="newItem" ng-click="edit()">
            <span class="glyphicon glyphicon-plus"></span>新增用户
        </a>
    </div>
</div>
<div class="main-con">
    <div class="row">
        <!--list -->
        <div class="col-xs-4">
            <search-box search-data="searchData" search-submit="getUserList(true)"></search-box>
            <div class="result-bar">
                共<span class="mColor" ng-bind="count"></span>条记录
            </div>
            <div class="lft-wrap box-shadow" when-scrolled="getUserList()">
                <ul class="data-list" repeat-list="getRgtModel()" active-id="{{activeId}}">
                    <li ng-repeat="item in userList track by $index" relativeId="{{item.Id}}" ng-class="{active:$index==0}">
                        <div class="media-left">
                            <fileinput item="item" modal-class="modal-sm" max-file-count="1" is-replace="true" upload-id="{{item.Id}}" upload-url="/user/icon/" delete-url="/user/icon/{{item.Id}}">
                                <div class="icon-box" ng-class="{gray:!item.Icon}">
                                    <img ng-if="item.Icon" class="media-object img-circle" alt="" width="60" height="60" ng-src="{{item.Icon}}">
                                    <i ng-if="!item.Icon" class="glyphicon glyphicon-user"></i>
                                </div>
                            </fileinput>
                        </div>
                        <div class="media-body">
                            <div class="media-body-top">
                                <a class="title link-txt" href="javascript:void(0)" ng-bind="item.UserName"></a>
                                <span class="label label-warning" ng-bind="item.RoleName"></span>
                            </div>
                            <div class="panel-info">
                                <dl>
                                    <dt>账号:</dt>
                                    <dd ng-bind="item.UserName"></dd>
                                </dl>
                                <dl>
                                    <dt>用户姓名:</dt>
                                    <dd ng-bind="item.Name"></dd>
                                </dl>
                                <dl>
                                    <dt>电话:</dt>
                                    <dd ng-bind="item.Phone"></dd>
                                </dl>
                                <!-- <dl>
                                    <dt>角色:</dt>
                                    <dd ng-bind="item.RoleName"></dd>
                                </dl> -->
                                <dl>
                                    <dt>组别:</dt>
                                    <dd>
                                        <span ng-repeat="group in item.Groups" ng-bind="group.Name" class="group-box"></span>
                                    </dd>
                                </dl>
                            </div>
                        </div>
                        <div class="media-right">
                            <div ng-if="roleid!=6" class="btn-wrap">
                                <a href="javascript:void(0)" ng-click="edit(item.Id,$index);$event.stopPropagation();">
                                    <span class="glyphicon glyphicon-edit"></span></a>
                                <a ng-class="{disabled:userInfo.id==item.Id}" href="javascript:void(0)" title="删除" ng-click="del(item,$index);$event.stopPropagation();">
                                    <span class="glyphicon glyphicon-trash"></span></a>
                                <a href="javascript:void(0)" title="重置密码" ng-click="editPsw(item.Id,item.UserName);$event.stopPropagation();">
                                    <span class="glyphicon glyphicon-lock"></span></a>
                            </div>
                        </div>
                    </li>
                </ul>
            </div>
        </div>
        <!--内容块-->
        <div class="col-xs-8">
            <div class="rgt-wrap box-shadow">
                <div class="widget flat radius-bordered">
                    <tabset flat="true">
                        <tab heading="工作统计">
                            <div ng-show="activeId">
                                <form name="userWork" ng-submit="getUserWorkCount()" novalidate>
                                    <table class="qry-tb">
                                        <tbody>
                                            <tr>
                                                <th>时间:</th>
                                                <td>
                                                    <div class="form-group">
                                                        <div class="date-wrap">
                                                            <div class="date-box start-box">
                                                                <p class="input-group start-box" ng-click="openDate($event,'date.openStarted')">
                                                                    <input type="text" name="begintime" class="form-control" datepicker-options="dateOptions" datepicker-popup="{{format}}" current-text="今天" clear-text="清除" close-text="关闭" ng-model="queryParam.beginTime" is-open="date.openStarted" readonly="readonly" required/>
                                                                    <span class="input-group-btn">
                                                                        <button type="button" class="btn btn-default"><i class="glyphicon glyphicon-calendar"></i></button>
                                                                    </span>
                                                                </p>
                                                            </div>
                                                            <span class="date-txt">到</span>
                                                            <div class="date-box end-box">
                                                                <p class="input-group start-box" ng-click="openDate($event,'date.openEnded')">
                                                                    <input type="text" name="endtime" class="form-control" datepicker-options="dateOptions" datepicker-popup="{{format}}" current-text="今天" clear-text="清除" close-text="关闭" ng-model="queryParam.endTime" is-open="date.openEnded" readonly="readonly" required/>
                                                                    <span class="input-group-btn">
                                                                        <button type="button" class="btn btn-default"><i class="glyphicon glyphicon-calendar"></i></button>
                                                                    </span>
                                                                </p>
                                                            </div>
                                                        </div>
                                                    </div>
                                                </td>
                                                <td>
                                                    <button type="submit" class="btn btn-primary" ng-disabled="userWork.$invalid">查询</button>
                                                </td>
                                            </tr>
                                        </tbody>
                                    </table>
                                </form>
                                <div class="bar-Chart" ng-init="chartInit()"></div>
                            </div>
                        </tab>
                    </tabset>
                </div>
            </div>
        </div>
    </div>
</div>
<!-- 编辑用户 -->
<div class="modal fade" id="editModal">
    <div class="modal-dialog">
        <form name="userForm" ng-submit="userFormSubmit()" novalidate>
            <div class="modal-content">
                <div class="modal-header">
                    <button type="button" class="close" data-dismiss="modal">
                        <span aria-hidden="true">&times;</span> <span class="sr-only">Close</span>
                    </button>
                    <h4 class="modal-title" ng-bind="editModalTitle"></h4>
                </div>
                <div class="modal-body">
                    <div class="form-group" ng-class="{ 'has-error' : userForm.UserName.$dirty&&userForm.UserName.$invalid}">
                        <div class="input-icon icon-right">
                            <input ng-disabled="userId" type="text" name="UserName" class="form-control" ng-model="userModel.UserName" placeholder="帐号" required ng-minlength="2" ng-maxlength="12" ng-pattern="/^[a-zA-Z0-9_\.]+$/">
                            <i class="glyphicon glyphicon-user circular"></i>
                            <p ng-show="userForm.UserName.$dirty && userForm.UserName.$error.required" class="help-block">用户名是必需的，并且不能是空的</p>
                            <p ng-show="userForm.UserName.$error.pattern" class="help-block">用户名只能由字母、数字、点和下划线组成</p>
                            <p ng-show="userForm.UserName.$error.minlength||userForm.UserName.$error.maxlength" class="help-block">用户名为2到12个字符</p>
                        </div>
                    </div>
                    <div ng-if="isAdd" class="form-group" ng-class="{ 'has-error' : userForm.Password.$dirty&&userForm.Password.$invalid}">
                        <div class="input-icon icon-right">
                            <input type="password" name="Password" class="form-control" ng-model="userModel.Password" placeholder="密码" required ng-minlength="6" ng-maxlength="12" ng-pattern="/^[a-zA-Z0-9_\.]+$/">
                            <i class="fa fa-lock circular"></i>
                            <p ng-show="userForm.Password.$dirty && userForm.Password.$error.required" class="help-block">密码是必需的，并且不能是空的</p>
                            <p ng-show="userForm.Password.$error.pattern" class="help-block">密码只能由字母、数字、点和下划线组成</p>
                            <p ng-show="userForm.Password.$error.minlength||userForm.Password.$error.maxlength" class="help-block">密码为6到12个字符</p>
                        </div>
                    </div>
                    <div class="form-group" ng-class="{ 'has-error' : userForm.Name.$dirty&&userForm.Name.$invalid}">
                        <div class="input-icon icon-right">
                            <input type="text" name="Name" class="form-control" ng-model="userModel.Name" placeholder="真实姓名" required ng-minlength="2">
                            <i class="glyphicon glyphicon-user circular"></i>
                            <p ng-show="userForm.Name.$dirty && userForm.Name.$error.required" class="help-block">真实姓名是必需的，并且不能是空的</p>
                            <p ng-show="userForm.Name.$error.minlength" class="help-block">真实姓名必须至少有2个字符</p>
                        </div>
                    </div>
                    <div class="form-group" ng-class="{ 'has-error' : userForm.Phone.$dirty&&userForm.Phone.$invalid}">
                        <div class="input-icon icon-right">
                            <input type="text" name="Phone" class="form-control" ng-model="userModel.Phone" placeholder="电话号码" required>
                            <i class="glyphicon glyphicon-earphone circular"></i>
                            <p ng-show="userForm.Phone.$dirty && userForm.Phone.$error.required" class="help-block">电话号码是必需的，并且不能是空的</p>
                        </div>
                    </div>
                    <div class="form-group" ng-class="{ 'has-error' : userForm.RoleId.$dirty&&userForm.RoleId.$invalid}">
                        <div class="input-icon icon-right">
                            <select name="RoleId" class="form-control" ng-model="userModel.RoleId" ng-options="role.Id as role.Name for role in roleList" required>
                                <option value="" disabled selected>请选择(角色)</option>
                            </select>
                            <p ng-show="userForm.RoleId.$dirty && userForm.RoleId.$error.required" class="help-block">角色是必需的，并且不能是空的</p>
                        </div>
                    </div>
                    <div class="form-title">组别</div>
                    <div class="form-group">
                        <div class="checkbox" ng-repeat="group in groupList track by $index">
                            <label>
                                <input type="checkbox" ng-checked="checked(group.Id,userModel.Groups)" ng-model="isChecked" ng-click="checkClick(group.Id,group.Name,isChecked)">
                                <span class="text" ng-bind="group.Name"></span> </label>
                        </div>
                    </div>
                </div>
                <div class="modal-footer">
                    <button type="submit" class="btn btn-primary" ng-disabled="userForm.$invalid||userModel.Groups.length==0">确定</button>
                    <button type="button" class="btn btn-warning" data-dismiss="modal">取消</button>
                </div>
            </div>
        </form>
    </div>
</div>
<!-- 删除用户 -->
<div class="modal fade" id="delModal">
    <div class="modal-dialog modal-sm">
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal">
                    <span aria-hidden="true">&times;</span> <span class="sr-only">Close</span>
                </button>
                <h4 class="modal-title">确定删除吗?</h4>
            </div>
            <div class="modal-body">
                <div class="panel-info">
                    <dl>
                        <dt>账号:</dt>
                        <dd ng-bind="delModel.UserName"></dd>
                    </dl>
                </div>
            </div>
            <div class="modal-footer">
                <button type="button" class="btn btn-warning" data-dismiss="modal">取消</button>
                <button type="button" class="btn btn-primary" ng-click="delConfirm()">确定</button>
            </div>
        </div>
    </div>
</div>
<!-- 重置密码 -->
<div class="modal fade" id="editPswModal">
    <div class="modal-dialog">
        <form name="pswForm" ng-submit="pswFormSubmit()" novalidate>
            <div class="modal-content">
                <div class="modal-header">
                    <button type="button" class="close" data-dismiss="modal">
                        <span aria-hidden="true">&times;</span> <span class="sr-only">Close</span>
                    </button>
                    <h4 class="modal-title">重置密码</h4>
                </div>
                <div class="modal-body">
                    <div class="form-group">
                        <span ng-bind="userName"></span>
                    </div>
                    <div class="form-group" ng-class="{ 'has-error' : pswForm.NewPassword.$dirty&&pswForm.NewPassword.$invalid}">
                        <div class="input-icon icon-right">
                            <input type="password" name="NewPassword" class="form-control" ng-model="NewPassword" placeholder="新密码" required ng-minlength="6" ng-maxlength="12" ng-pattern="/^[a-zA-Z0-9_\.]+$/">
                            <i class="fa fa-lock circular"></i>
                            <p ng-show="pswForm.NewPassword.$dirty&&pswForm.NewPassword.$error.required" class="help-block">新密码是必需的，并且不能是空的</p>
                            <p ng-show="pswForm.NewPassword.$error.pattern" class="help-block">密码只能由字母、数字、点和下划线组成</p>
                            <p ng-show="pswForm.NewPassword.$error.minlength||pswForm.NewPassword.$error.maxlength" class="help-block">密码为6到12个字符</p>
                        </div>
                    </div>
                    <div class="form-group" ng-class="{ 'has-error' : pswForm.passwordagain.$dirty&&(pswForm.passwordagain.$invalid||passwordagain!=NewPassword)}">
                        <div class="input-icon icon-right">
                            <input type="password" name="passwordagain" class="form-control" ng-model="passwordagain" placeholder="密码确认" required ng-minlength="6" ng-maxlength="12" ng-pattern="/^[a-zA-Z0-9_\.]+$/">
                            <i class="fa fa-lock circular"></i>
                            <p ng-show="pswForm.passwordagain.$dirty && pswForm.passwordagain.$error.required" class="help-block">确认密码是必需的，并且不能是空的</p>
                            <p ng-show="pswForm.passwordagain.$error.pattern" class="help-block">密码只能由字母、数字、点和下划线组成</p>
                            <p ng-show="pswForm.passwordagain.$error.minlength||pswForm.passwordagain.$error.maxlength" class="help-block">密码为6到12个字符</p>
                            <p ng-show="pswForm.passwordagain.$valid&&passwordagain!=NewPassword" class="help-block">两次输入密码不一致</p>
                        </div>
                    </div>
                </div>
                <div class="modal-footer">
                    <button type="submit" class="btn btn-primary" ng-disabled="pswForm.$invalid||passwordagain!=NewPassword">确定</button>
                    <button type="button" class="btn btn-warning" data-dismiss="modal">取消</button>
                </div>
            </div>
        </form>
    </div>
</div>
